<template>
  <!-- 组件中只有一个弹窗 -->
  <el-dialog
      v-model="workstationAddWinDialogVisible"
      title="添加物料/产品"
      width="70%"
      @close="handleClose"
  >
    <template #default>
      <el-form style="margin-top: 10px" :model="newWorkstation"  label-width="auto">

        <el-form-item style="font-weight: bold;width: 480px;float: left;" label="工作站编码">
          <el-input v-model="newWorkstation.workstationCode"/>
        </el-form-item>

        <el-form-item style="font-weight: bold;width: 400px;margin-left: 600px" label="工作站名称">
          <el-input v-model="newWorkstation.workstationName"/>
        </el-form-item>

        <el-form-item style="font-weight: bold;width: 480px;float: left;" label="工作站地址">
          <el-input v-model="newWorkstation.workstationAddress"/>
        </el-form-item>

        <el-form-item style="font-weight: bold;width: 600px;margin-left: 600px" label="所在车间">
          <el-select v-model="newWorkstation.workShopId" style="width: 250px">
            <el-option v-for="workShop in workShops" :value="workShop.workShopId" :label="workShop.workShopName"/>
          </el-select>
        </el-form-item>

        <el-form-item style="font-weight: bold;width: 380px;float: left;" label="所属工序">
          <el-select v-model="newWorkstation.processId" style="width: 250px">
            <el-option v-for="process in procezz" :value="process.processId" :label="process.processName"/>
          </el-select>
        </el-form-item>


        <el-form-item style="font-weight: bold;margin-left: 600px;" label="是否启用">
          <el-radio-group v-model="newWorkstation.workstationStatus">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="2">否</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item style="font-weight: bold" label="备注">
          <el-input v-model="newWorkstation.remark" type="textarea"/>
        </el-form-item>
      </el-form>
    </template>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="cancelnewWorkstation">取消</el-button>
        <el-button type="primary" @click="newWorkstationSubmit">
          提交
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import {onMounted, ref, watch} from 'vue'
import {ElMessage} from "element-plus";
import workShopRequest from "@/api/workShop.js";
import workstationRequest from "@/api/workstation.js";
import processRequest from "@/api/process.js";
// 定义数组保存所有车间信息
let workShops = ref([]);
// 定义数组保存所有工序信息
let procezz = ref([]);

// 申明这个组件的事件  editComplete
const emits = defineEmits(['addComplete','cancelWorkstationAdd'])

// 弹窗标记
let workstationAddWinDialogVisible = ref(false);

let props = defineProps(["isShow"]);
// 编辑的单位对象
let newWorkstation = ref({workstationStatus:1});
/**
 * 取消新增按钮事件
 */
function cancelnewWorkstation(){
  newWorkstation = ref({workstationStatus:1});
  workstationAddWinDialogVisible.value = false;
  emits("cancelWorkstationAdd")
}

/**
 * 关闭窗体前的回调函数
 */
function handleClose(){
  cancelnewWorkstation();
  emits("cancelWorkstationAdd")
}

/**
 * 新增提交
 */
function newWorkstationSubmit(){
  if (newWorkstation.value.workShopId) {
  workShopRequest.selectById(newWorkstation.value.workShopId,res => {
    // 更新 newMaterial 的值
    newWorkstation.value.workShopCode = res.data.workShopCode;
    newWorkstation.value.workShopName = res.data.workShopName;
    if (newWorkstation.value.processId) {
      processRequest.showByProcessId(newWorkstation.value.processId,res=>{
        newWorkstation.value.processName = res.data.processName;
        workstationRequest.save(newWorkstation.value,res=>{
          if(res.code === 200){
            ElMessage({
              type:"success",
              message:"新增工作站成功"
            });
            // 关闭弹窗
            cancelnewWorkstation();
            // 触发编辑完成的事件
            emits('addComplete',res.data);
          }else if (res.data == '工作站编码不能为空') {
            ElMessage({
              type:"warning",
              message:"工作站编码不能为空"
            });
          } else if (res.data == '工作站名称不能为空') {
            ElMessage({
              type:"warning",
              message:"工作站名称不能为空"
            });
          } else {
            ElMessage({
              type:"warning",
              message:"新增工作站失败"
            });
          }
        });
      });
    } else {
      ElMessage({
        type:"warning",
        message:"工序必须选择"
      });
    }

  }); } else {
    ElMessage({
      type:"warning",
      message:"车间必须选择"
    });
  }
}

/**
 * 侦听器 侦听 props.isShow
 */
watch(()=>props.isShow,()=>{
  workstationAddWinDialogVisible.value = props.isShow;
});


onMounted(()=>{
  // 加载工序对象
  processRequest.listAll(res => {
    // 将查询的列表赋值给 procezz
    procezz.value = res.data;
  })

  //加载工作站对象
  workShopRequest.ListWorkShops(res => {
    workShops.value = res.data;
  })
})
</script>
<style scoped>

</style>